<template>
  <div>
    <TableQuery
      :query="tableQuery"
      :loadTableList="loadTableList"
      :clearQuery="clearQuery"
      :queryFormHeaders="queryFormHeaders"
      :removeQueryField="removeQueryField"
    />
  </div>
</template>

<script lang="ts" setup>
import TableQuery from '@/components/base/table/TableQuery.vue';
import { computed, defineProps, withDefaults } from 'vue';
// 接收父组件参数
interface Props {// 需要在父组件引入自定义的@/api/uem/useTableList.ts组件，然后将其中的部分属性传过来
  query: Record<string, any>, // 查询表单对象
  loadTableList:()=>void, // 重新加载表格
  clearQuery:()=>void // 清空查询条件
  removeQueryField:(key:string)=>void // 移除查询条件中的某个元素
}
const props = withDefaults(defineProps<Props>(), {
  query: () => ({}), // 返回空对象
});
// 定义查询表单对象，避免直接使用props导致eslint报错
const tableQuery = computed(() => props.query);
// 定义查询表单的内容
const queryFormHeaders = [ // 查询表单
  {
    prop: 'name',
    label: '专业群名',
  },
  {
    prop: 'departNameQ',
    label: '部门名称',
  },
  {
    prop: 'sort',
    label: '排序',
    placeholder: '请输入排序',
    show: false,
  },
];
</script>

<style scoped>

</style>
